/**
  * @description: 订单编号、订单状态。。。
*/
<template>
  <div class="pages">
    <div class="main-div">
      <van-cell-group inset>
        <van-cell title="订单编号" :value="orderDetailData.orderCode" />

        <template v-if="orderDetailData.orderType == 3">
          <van-cell :value="orderDetailData.cancelCode">
            <!-- 使用 title 插槽来自定义标题 -->
            <template #title>
              <span class="oddNumbers-div">
                <span> 兑换码 </span>
                <span
                  class="oddNumbers"
                  @click="copyFunction(orderDetailData.cancelCode)"
                  ><img src="@/assets/copy.png" width="14px" alt=""
                /></span>
              </span>
            </template>
          </van-cell>
        </template>

        <template v-if="orderDetailData.orderType == 2">
          <van-cell title="配送方式" :value="orderDetailData.shipTypeName" />
        </template>

        <van-cell title="订单状态" :value="orderDetailData.orderStatusName" />

        <template
          v-if="
            orderDetailData.orderType == 3 && orderDetailData.orderStatus == 2
          "
        >
          <van-cell title="核销时间" :value="orderDetailData.cancelTime" />
        </template>

        <template v-if="orderDetailData.shipType == 1 && orderDetailData.lgstcinfoCorp">
          <van-cell title="物流公司" :value="orderDetailData.lgstcinfoCorp" />
          <van-cell :value="orderDetailData.lgstcinfoCode">
            <!-- 使用 title 插槽来自定义标题 -->
            <template #title>
              <span class="oddNumbers-div">
                <span> 物流单号 </span>
                <span
                  class="oddNumbers"
                  @click="copyFunction(orderDetailData.lgstcinfoCode)"
                  ><img src="@/assets/copy.png" width="14px" alt=""
                /></span>
              </span>
            </template>
          </van-cell>
        </template>
        <van-cell title="备注" :value="orderDetailData.failMessage" v-if="orderDetailData.failMessage" />
      </van-cell-group>
    </div>
  </div>
</template>

<script>
export default {
  name: "orderStatus",
  props: {
    orderDetailData: Object,
  },
  data() {
    return {};
  },
  created() {},
  methods: {},
};
</script>
<style scoped lang="less">
.pages {
  margin-top: 12px;
  .van-cell__title {
    color: #999;
  }
  .van-cell__value {
    font-family: PingFang SC, PingFang SC-Bold;
    font-weight: 700;
    color: #000000;
    flex: 2;
  }
  .van-divider {
    margin: 0 12px;
  }
  .van-cell {
    // padding: 10px 12px;
  }
  .van-cell-group--inset {
    margin: 0;
  }
  .oddNumbers-div {
    display: flex;
  }
  .oddNumbers {
    display: flex;
    align-items: center;
    margin-left: 5px;
  }
}
</style>
